<!DOCTYPE html>
<html lang="zxx" xmlns:th="http://www.thymeleaf.org">
<head th:replace="admin/common/head(${webInfo})"></head>

<body class="fixed-left">
<!-- Begin page -->
<div id="wrapper">
    <div th:replace="admin/common/top_bar(null)"></div>
    <div th:replace="admin/common/side_menu(null)"></div>
    <div class="content-page">
        <div class="content">
            <div class="container">
                <div class="row">
                    <div class="col-sm-12">
                        <h4 class="pull-left page-title">角色管理 !</h4>
                        <ol class="breadcrumb pull-right">
                            <li><a href="#">认证管理</a></li>
                            <li class="active">角色管理</li>
                        </ol>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h3 class="panel-title">角色列表</h3>
                            </div>
                            <div class="panel-body">
                                <div class="row">
                                    <div class="col-md-12 col-sm-12 col-xs-12" style="margin-bottom: 10px;">
                                        <button type="button" onclick="addRole()"
                                                class="btn btn-info btn-rounded btn-xs">
                                            <i class="ion-plus-circled">添加角色</i>
                                        </button>
                                    </div>
                                    <div class="col-md-12 col-sm-12 col-xs-12">
                                        <table class="table table-bordered">
                                            <thead>
                                            <tr>
                                                <th>角色名</th>
                                                <th>创建时间</th>
                                                <th>创建人</th>
                                                <th>修改时间</th>
                                                <th>修改人</th>
                                                <th>操作</th>
                                            </tr>
                                            </thead>
                                            <tbody id="roleList">
                                            <tr th:each="role: ${roles}">
                                                <td th:text="${role.getRoleName()}">Jacob</td>
                                                <td th:text="${role.getCreateAt()}">2022-3-15</td>
                                                <td th:text="${role.getCreateBy()}">geticsen</td>
                                                <td th:text="${role.getUpdateAt()}">2022-3-15</td>
                                                <td th:text="${role.getUpdateBy()}">geticsen</td>
                                                <td>
                                                    <button th:onclick="'modifyRole('+${role.getId()}+',this)'"
                                                            class="btn btn-icon btn-xs btn-warning">
                                                        <i class="ion-edit"></i>
                                                        修改
                                                    </button>
                                                    <button th:data="${role.getId()}"
                                                            onclick="manageUserRole(this)"
                                                            class="btn btn-purple btn-xs">
                                                        <i class="ion-android-mixer"></i>
                                                        角色
                                                    </button>
                                                    <button th:onclick="'deleteRole('+${role.getId()}+',this)'"
                                                            class="btn btn-icon btn-xs btn-danger">
                                                        <i class="ion-close-circled"></i>
                                                        删除
                                                    </button>
                                                </td>
                                            </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <footer class="footer text-right">
            2022 © FileShare.
        </footer>
    </div>
</div>
<script th:replace="admin/common/base_script"></script>
<script th:src="@{/plugins/request/axios.min.js}"></script>
<script th:src="@{/plugins/request/request.js}"></script>
<script th:src="@{/plugins/alert/nz-alert/NZ-MsgBox.min.js}"></script>
<script th:src="@{/plugins/alert/nz-alert/NZ-Drag.min.js}"></script>
<script th:src="@{/admin/js/auth.js}"></script>
<script type="text/javascript">
    let resizeFunc = [];
</script>
</body>
</html>